<template>
	<view class="">
		<view class="user-panel">
			<view class="flex flex--row justify-between align-center line-white">
				<text>可提现金额</text>
				<text class="fsize-24 mt-20">{{detail.schemeName}} | 专属管家: {{detail.managerName}}</text>
				<text class="fsize-36 mt-20 line-red bg-white border-radius-10 pl-20 pr-20 pt-6 pb-6">￥{{detail.bonusBalance}}</text>
			</view>
		</view>
		
		<view class="data">
			<my-cell-group 
				title="客户列表" 
				icon-type="hollow" 
				icon="icon-kehu" 
				icon-color="#145ce6" 
				:url="`/pages/shop/Shareholder/customer?id=${staffid}&&userName=${detail.userName}`" 
			/>
			<my-cell-group 
				title="分红记录" 
				icon-type="hollow" 
				icon="icon-fenhong" 
				icon-color="#e04f7a" 
				:url="`/pages/shop/IncentivePolicy/list?id=${staffid}&&userName=${detail.userName}`" 
			/>
			<my-cell-group 
				title="联创本金记录" 
				icon-type="hollow" 
				icon="icon-caiwuzhutifenxi" 
				icon-color="#f19445" 
				:url="`/pages/finance/stockList?id=${staffid}&&userName=${detail.userName}`" 
			/>
			<my-cell-group 
				title="结算记录" 
				icon-type="hollow" 
				icon="icon-jinrongguanli_o" 
				icon-color="#9852e8" 
				:url="`/pages/finance/settlementList?id=${staffid}&&userName=${detail.userName}`" 
			/>
			<my-cell-group 
				title="拓客礼包" 
				icon-type="hollow" 
				icon="icon-basesalescardPackage" 
				icon-color="#4377d7" 
				:url="`/pages/shop/GiftPack/tokerList?id=${staffid}&&userName=${detail.userName}`" 
			/>
			<my-cell-group 
				title="联创本金增减" 
				icon-type="hollow" 
				icon="icon-xiangmu" 
				icon-color="#e54778" 
				:url="`/pages/shop/Shareholder/balanceSettings?id=${staffid}`" 
			/>
			<my-cell-group 
				title="结算标记" 
				icon-type="hollow" 
				icon="icon-jisuan" 
				icon-color="#3e51d4" 
				:url="`/pages/shop/Shareholder/settleAccounts?id=${staffid}`" 
			/>
			<my-cell-group 
				title="修改联创" 
				icon-type="hollow" 
				icon="icon-bianji" 
				icon-color="#7faee2" 
				:url="`/pages/shop/Shareholder/edit?id=${staffid}&&type=2`" 
			/>
			<my-cell-group title="禁用账户" icon-type="hollow" icon="icon-forbidden" icon-color="#dc4371">
				<view slot="right-value">
					<u-switch
						v-model="lcInfo.status"
						:activeValue="1" 
						:inactiveValue="2" 
						activeColor="#e54d42" 
						inactiveColor="#606266"
						@change.stop="stateChange"
						asyncChange
					></u-switch>
				</view>
			</my-cell-group>
		</view>
	<u-toast ref="uToast" />
	</view>

</template>

<script>
	import { mapState, mapMutations } from 'vuex'
	import myCellGroup from '@/components/my-cell-group/index.vue'
	export default {
		components:{ myCellGroup },
		data() {
			return {
				detail:{},
				lcInfo: {
					status: 1,
				},
				accountState:false,
				staffid: null,
			}
		},
		computed: { ...mapState(['store']) },
		onLoad(option) {
			// console.log('nitamad',option)
			const that = this
			this.staffid = option.id
			this.getData(this.staffid)
			this.getUserInfo(this.staffid)
			uni.$on('upDetail', obj=>{
				that.getData(obj.staffid)
			})
		},
		onUnload() {
			uni.$off('upDetail')
		},
		methods: {
			getUserInfo(id) {
				this.$reqJsonPost('StockHolderGetEdit',{ id:id }).then(res => {
					this.lcInfo = {
						staffId: res.data.id,
						nickName: res.data.nickName,
						phone: res.data.phone,
						sex: res.data.sex,
						sexText: res.data.sex===1?'男':res.data.sex===2?'女':'未知',
						schemeId: res.data.schemeId,
						schemeName:res.data.schemeName,
						parentId: res.data.topStaffId,
						parentName: res.data.topStaffName||'',
						managerName: res.data.managerName,
						managerId: res.data.managerId,
						status: res.data.status,
						trueName: res.data.trueName||'未命名联创',
						storeName: res.data.storeName,
						storeId: res.data.storeId,
					}
				})
			},
			getData(id){
				this.$reqJsonPost('GetStockHolderDetails',{ id:id }).then(res=>{
					this.detail = res.data
				})
			},
			stateChange(val) {
				const that = this
				this.lcInfo.status = val
				this.$reqJsonPost('StockHolderDoEdit', that.lcInfo).then(res => {
					if (res.code === 0) {
						that.$refs.uToast.show({
							message: '修改成功'
						})
					}else {
						that.$refs.uToast.show({
							message: res.msg,
							complete() {
								that.getUserInfo(that.staffid)
							}
						})
					}
				})
				// this.detail.statusFlag = val
				// this.detail.status = val?2:1
				// this.$reqJsonPost('StockHolderDoEdit', { 
				// 	id:this.detail.id, 
				// 	statusFlag: this.detail.statusFlag,
				// 	status: this.detail.status ,
				// }).then(res=>{})
			},
			navTo(path){
				console.log(path)
				if(path==='customer'){
					uni.$u.route('/pages/shop/Shareholder/customer?id='+ this.detail.id)
				}else if(path==='servicesorder'){
					uni.$u.route('/pages/order/serviceorder/servicesList?id='+ this.detail.id)
				}else if(path==='stock'){
					uni.$u.route('/pages/finance/stockList?id='+ this.detail.id)
				}else if(path==='settlement'){
					uni.$u.route('/pages/finance/settlementList?id='+ this.detail.id)
				}else if(path==='editinfo'){
					uni.$u.route('/pages/shop/Staff/edit?id='+ this.detail.id)
				}else if(path==='editstock'){
					uni.$u.route('/pages/shop/StaffStock/edit?id='+ this.detail.id)
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.user-panel {
		padding: 50rpx 20rpx;
		background: linear-gradient(to bottom right,#fa436a,#e88462);
		position: relative;
		.detail{
			text-align: center;
			color: #fff;
		}
		.amount{
			text-align: center;
			color: #fa436a;
			background: #fff;
			margin-top: 20rpx;
			font-size: 42rpx;
			margin:  40rpx auto 50rpx;
			padding: 10rpx 30rpx;
			border-radius: 10rpx;
		}
		.tip{
			margin-top: 50rpx;
			color: #fff;
			font-size: 28rpx;
		}
		.detail{
			margin-top: 20rpx;
			color: #fff;
			font-size: 28rpx;
		}
		.achievementdetail{
			margin:30rpx 10rpx 20rpx;
			background: rgba(255, 255, 255, 0.9);
			border-radius: 30rpx;
			.value{
				color: red;
			}
			.label{
				color:gray;
			}
		}
		.img {
			display: block;
			width: 120rpx;
			height: 120rpx;
			border-radius: 50%;
			flex-shrink: 0;
		}



		.utim {
			color: #fff;
			font-size: 26rpx;
			line-height: 40rpx;
		}
	}
	.cell_item{ background: #FFFFFF;}
	.bg-white{ background: #FFFFFF;}
	.u-cell{background: #FFFFFF;}
	.group_title {
		display: block;
		margin-left: 20rpx;
		margin-top: 20rpx;
		margin-bottom: 20rpx;
		font-size: 28rpx;
		color: #666;
	}
</style>
